<template>
    <div>
      <el-input
        style="margin-left: 10px; width: 230px"
        placeholder="组织名称..."
        v-model="filterText"
        prefix-icon="el-icon-search"
        size="small"
      ></el-input>
      <el-tree
        style="margin-left: 10px; width: 280px;height: 100%;"
        class="filter-tree"
        :data="department"
        :props="defaultProps"
        :filter-node-method="filterNode"
        ref="tree"
        show-checkbox
        default-expand-all="true"
        @check="handleCheckChange"
      >
      </el-tree>
    </div>
  </template>
  
  <script>
  export default {
    props: ["department"],
  
    watch: {
      filterText(val) {
        this.$refs.tree.filter(val);
      },
    },
  
    data() {
      return {
        filterText: "",
        defaultProps: {
          children: "children",
          label: "label",
        },
      };
    },
  
    methods: {
      handleCheckChange() {
        let selectobj = this.$refs.tree.getCheckedNodes();
        this.$emit("handleCheckChange", selectobj);
      },
  
      filterNode(value, data) {
        if (!value) return true;
        return data.label.indexOf(value) !== -1;
      },
    },
  };
  </script>
  
  <style lang="scss" scoped>
  </style>